<?php
require_once('../classes/face/Face.class.php');


$face= new RPGFace();

$my_shape_js = json_encode($face->get16x16Face());


?><html>
<body>
	<canvas id="myCanvas" width="400" height="400"></canvas>
	<script>
		// Le niveau de ZOOM
		var pixel_size = 4;

		var shapeArray = <?php echo $my_shape_js; ?>

		function drawArray(array) {
			for (var y=0, count_y = array.length; y < count_y; y++) {
				for (var x=0, count_x = array[y].length; x < count_x; x++) {
					context.fillStyle = '#' + array[y][x];
					context.fillRect(x*pixel_size, y*pixel_size, pixel_size, pixel_size);
				}
			}
		}


		var canvas = document.getElementById('myCanvas');
		var context = canvas.getContext('2d');

		drawArray(shapeArray);
	</script>
</body>
</html>